<template>
  <div>
  <div class="header">
  <van-search
  v-model="value"
  show-action
  shape="round"
  placeholder="卡姿兰大眼睛">

   <template #left>
 <van-icon name="arrow-left" @click="$router.go(-1)"/>
  </template>

  <template #action>
 <div class="login">搜索</div>
  </template>
 </van-search>
  </div>
    <div class="body">
    <p><span>历史搜索</span><span>隐藏</span></p>
    <van-tag round type="primary" v-for="item in list" :key="item.num">{{item.keyword}}</van-tag>
    </div>
     <div class="body">
    <p><span>热门搜索</span><span>隐藏</span></p>
    <van-tag round type="danger" v-for="item in list" :key="item.num">{{item.keyword}}</van-tag>
    </div>
    
  </div>
</template>

<script setup lang="ts">
import{hotsearch}from "../api/search"
import{ref,reactive} from 'vue'
let list:any=ref([{}])
hotsearch().then((res:any)=>{
    list.value=res.data
    console.log(list);
    
})
const value =ref("")
</script>
<style scoped lang="scss">
.body{
  p{
      display: flex;
      justify-content: space-between;
  }
}
.van-tag{
    margin: 5px;
}
</style>